<template>
  <ele-modal form width="500" :model-value="modelValue" :show-close="false" :modal="true" title="打印学生核对单"
             @update:modelValue="updateModelValue">
    <el-form :inline="false" :model="form">
      <el-form-item label="毕业年份">
        <dict-data
          code="graduation_year"
          v-model="form.graduationYear"
          placeholder="请选择毕业年份"
        />
      </el-form-item>
      <el-form-item label="所属校区">
        <dict-data
          code="campus"
          v-model="form.campus"
          placeholder="请选择学生所属校区"
        />
      </el-form-item>
      <el-form-item label="所在系别">
        <el-select
          v-model="form.department"
          clearable
          filterable
          style="width: 100%;"
          placeholder="请选择系别">
          <el-option
            v-for="item in departmentOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="所在专业">
        <el-select
          v-model="form.major"
          clearable
          filterable
          style="width: 100%;"
          class="autoWidth-select"
          placeholder="请选择专业">
          <el-option
            v-for="item in majorOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-divider/>
    <div style="text-align: center;">
      <el-button @click="updateModelValue(false)">关闭</el-button>
      <el-button type="primary" @click="showPrintCheckListModal()">打印</el-button>
    </div>

    <print-check-list-modal v-if="printCheckListModalShow" v-model="printCheckListModalShow"
                            :data="selectFormObject"></print-check-list-modal>


  </ele-modal>
</template>


<script setup>
import {ref, reactive, watch, onMounted} from 'vue';
import {getGrade, getDepartment, getMajor, getUser} from '@/api/manage/student/admin/common.js';
import {getConfigKey} from "@/api/system/config";

import PrintCheckListModal from './print-check-list-modal.vue'


const emit = defineEmits(['done', 'update:modelValue']);


const gradeOptions = ref([]);
const departmentOptions = ref([]);
const majorOptions = ref([]);

const selectFormObject = ref({
  campus: '',
  graduationYear: '',
  department: '',
  major: '',
});

const props = defineProps({
  /** 弹窗是否打开 */
  modelValue: Boolean,
  /** 修改回显的数据 */
  data: String
});
/** 更新modelValue */
const updateModelValue = (value) => {
  emit('update:modelValue', value);
};

const form = reactive({
  campus: '',
  graduationYear: '',
  department: '',
  major: '',
});


const initGrade = () => {
  // let _this = this;
  getGrade().then(response => {
    gradeOptions.value = response.data;
  });
}

const initDepartment = () => {
  getDepartment().then(response => {
    departmentOptions.value = response.data;
  });
}

const initMajor = () => {
  getMajor().then(response => {
    majorOptions.value = response.data;
  });
}


/**
 * 获取当前毕业年份
 */
const initCurrentGraduationYear = () => {
  getConfigKey("current.graduation.year").then(response => {
    form.graduationYear = response.msg;
  });
}

const printCheckListModalShow = ref(false);

const showPrintCheckListModal = () => {

  selectFormObject.value.campus = form.campus;
  selectFormObject.value.graduationYear = form.graduationYear;
  selectFormObject.value.department = form.department;
  selectFormObject.value.major = form.major;

  printCheckListModalShow.value = true;
}


onMounted(() => {
  initGrade();
  initDepartment();
  initMajor();
  initCurrentGraduationYear();
});

</script>
